<template>
  <div class="reconciliation-manage">
    <search-table
      :url="url"
      ref="searchtable"
      :columns="columns"
      :form="form"
      :hideSelect="true"
    >
      <template slot="searchForm">
        <a-form layout="inline" :form="form">
          <a-row>
            <a-form-item label="账单时间">
              <fast-range-picker
                style="width: 240px"
                v-decorator="['startTime-endTime']"
                :showBtn="true"
              >
              </fast-range-picker>
            </a-form-item>
            <a-form-item label="类型">
              <a-select
                showSearch
                allowClear
                style="width: 150px"
                :options="reconciliationTypeList"
                v-decorator="['type']"
                placeholder="请选择"
              >
              </a-select>
            </a-form-item>

            <a-form-item label="单号">
              <a-input
                v-decorator="['orderNo']"
                placeholder="订单编号/支付流水号"
              >
              </a-input>
            </a-form-item>
          </a-row>
        </a-form>
      </template>
      <template slot="tableOperation" slot-scope="{ record }">
        <a-space>
          <!-- <permission authority="shop:user:modify"> -->
          <!---->
          <span class="text-primary pointer" @click="jumpDetail(record.id)"
            >详情</span
          >
          <!-- </permission> -->
        </a-space>
      </template>
    </search-table>
  </div>
</template>
<script>
import { mapState } from "vuex";
// import {findDictNameByValue, createOptionsByDict} from '@/utils/dict'
const renderContent = (value, row, index) => {
  const obj = {
    children: value,
    attrs: {},
  };
  return obj;
};
export default {
  name: "MoneyReconciliation",
  data() {
    return {
      startValue: null, // 开始时间
      endValue: null, // 结束时间

      roleIdTypeOptions: [],
      reconciliationTypeList: [
        {
          label: "全部",
          value: 0,
        },
        {
          label: "订单入账",
          value: 1,
        },
        {
          label: "提现",
          value: 2,
        },
        {
          label: "退款",
          value: 3,
        },
      ],
      url: "/shop/bill/page",

      infoVisible: false,
      currentRecord: {},
      form: this.$form.createForm(this, { name: "table_search" }),
      columns: [
        {
          title: "类型",
          dataIndex: "type",
          key: "type",
          customRender: (text, row) => {
            switch (+text) {
              case 1:
                return "订单入账";
              case 2:
                return "提现";
              case 3:
                return "退款";
            }
            // return <table-img src={text} />;
          },
        },
        {
          title: "入账时间",
          dataIndex: "billTime",
          key: "billTime",
        },
        {
          title: "名称",
          dataIndex: "name",
          key: "name",
        },
        {
          title: "业务单号",
          dataIndex: "orderNo",
          key: "orderNo",
          // colSpan: 2,
          customRender: (value, row, index) => {
            const obj = {
              children: value,
              attrs: {},
            };
            // if (index === 2) {
            //   obj.attrs.rowSpan = 2;
            // }
            // // These two are merged into above cell
            // if (index === 3) {
            //   obj.attrs.rowSpan = 0;
            // }
            // if (index === 4) {
            // obj.attrs.colSpan = 2;
            // }
            return obj;
          },
        },
        {
          title: "支付流水号",
          dataIndex: "paymentNo",
          key: "paymentNo",
          // colSpan: 0,
        },
        {
          title: "账户",
          dataIndex: "account",
          key: "account",
        },
        {
          title: "收支类型",
          dataIndex: "billType",
          key: "billType",
          customRender(text, row) {
            if (text == 1) {
              text = "收入";
            } else if (text == 2) {
              text = "支出";
            } else {
              text = "——";
            }
            return text;
          },
        },
        {
          title: "金额（元）",
          dataIndex: "shopSum",
          key: "shopSum",
          customRender(text, row) {
            return ((text * 1) / 100).toFixed(2);
          },
        },
        {
          title: "支付方式",
          dataIndex: "orderPayType",
          key: "orderPayType",
          customRender: (text, row) => {
            if (text == "1") {
              text = "微信小程序支付";
            }
            return text;
          },
        },
        {
          title: "来源",
          dataIndex: "shopName",
          key: "shopName",
        },
        {
          title: "操作",
          dataIndex: "operation",
          scopedSlots: { customRender: "operation" },
        },
      ],
    };
  },
  components: {},
  computed: {
    ...mapState({
      userInfo: (state) => state.userInfo || {},
    }),
  },
  created() {},
  mounted() {},
  methods: {
    // 跳转到新建微页面装修页面
    jumpDetail(decorationId = "") {
      let query = {};
      if (decorationId !== "") {
        query = {
          id: decorationId,
        };
      }
      this.$router.push({
        path: "/money/reconciliation/detail",
        query,
      });
    },
    //上次消费时间
    disabledStartDate(startValue) {
      const endValue = this.endValue;
      if (!startValue || !endValue) {
        return false;
      }
      return startValue.valueOf() > endValue.valueOf();
    },
    disabledEndDate(endValue) {
      const startValue = this.startValue;
      if (!endValue || !startValue) {
        return false;
      }
      return startValue.valueOf() >= endValue.valueOf();
    },
    handleStartOpenChange(open) {
      if (!open) {
        this.endOpen = true;
      }
    },
    handleEndOpenChange(open) {
      this.endOpen = open;
    },

    exportExcel(){
      /* const params = this.$refs.searchtable.searchParams || {}
       const selectedIds = this.$refs.searchtable.selectedRowKeys
       console.log(selectedIds )
       if (selectedIds && selectedIds.length) {
         params['id'] = selectedIds.join(',')
       }
       console.log(params)
       this.$export('/order/goodsrepairs/export',params)*/
      // this.$export('/order/goodsrepairs/export', params)
    },

    deleteRows(ids) {
      if (!ids || ids.length === 0)
        return this.$message.warn("请先选择一项后再进行操作");
      this.$confirm({
        title: "删除提示",
        content: "删除操作不可恢复，请确认是否删除？",
        okText: "确认删除",
        cancelText: "取消",
        onOk: () => {
          this.$post("/shop/user/delete", ids).then((res) => {
            if (res && res.returnCode == 1000) {
              this.$message.success("删除成功");
              this.$refs.searchtable.refreshTable();
            }
          });
        },
      });
    },
  },
};
</script>
<style lang="less" scoped>
/deep/ .ant-btn {
  margin-left: 10px;
}
// /deep/.ant-table-thead > tr > th[colspan]:not([colspan="1"]) {
//   text-align: left !important;
// }
</style>
